
let query = {
  pagenum: 1,  //页码值
  pagesize: 10,  //每页显示多少条数
}

axios.get('/index/index').then(({status }) => {
  // console.log(data, status)
  if (status !== 200) {
    return layer.msg('获取信息失败')
  }
  // layer.msg('获取信息成功')

  // banner 轮播图部分
  layui.use('carousel', function () {
    let carousel = layui.carousel;
    //建造实例
    carousel.render({
      elem: '#test1',
      width: '100%', //设置容器宽度
      arrow: 'always' //始终显示箭头
      //,anim: 'updown' //切换动画方式
    });
  });
  $("#test1").find("button").hide()

  $("#test1").on("mouseenter", function () {
    $(this).find("button").show()
  })
  $("#test1").on("mouseleave", function () {
    $(this).find("button").hide()
  })
})
// ================热门推荐==============================
axios.get('/index/hot').then(({ data: { data } }) => {
  // console.log(data)
  const { list } = data
  const newText = list.map(({ pic, title }) => {
    // console.log(pic)
    return `
        <li class="item"><a target="_blank" href=""><img src="http://124.223.14.236:8060/${pic}"
        class="thumb" />${title}</a></li>`
  }).join('')
  $('.sticky ul').html(newText)
})

// ======================最近更新==============================
getNew()
function getNew() {
  axios.get('/index/new', {
    params: {
      page: query.pagenum,
      limit: query.pagesize
    }
  }).then(({ data: { data: { list, num_day, num_week } } }) => {
    // console.log(list)
    const { data, count, pageSize } = list
    // console.log(count)
    const rewen = data.map(({ id, title, author, create_date, description, click, lovenum, pic }) => {
      const time = create_date
      const date = new Date(time)
      let newTime = date.getFullYear() + '-' + date.getMonth() + '-' + date.getDay()
      return `
        <article class="excerpt excerpt-one">
        <header>
          <a class="cat label label-important" href="">热门<i class="label-arrow"></i></a>
          <h2>
            <a target="_blank" href="show.html?${id}" id="show" data-id="${id}" title="${title}">${title}</a>
          </h2>
        </header>
        <p class="text-muted time">
          <a href="">${author}</a> 发布于 ${newTime}
        </p>
        <p class="focus">
          <a target="_blank" href="http://blog.weknow.cn/474.shtml" class="thumbnail">
            <span class="item"><span class="thumb-span"><img src="http://124.223.14.236:8060/${pic}"
                  class="thumb" /></span></span></a>
        </p>
        <p class="note">${description}</p>
        <p class="text-muted views">
          <span class="post-views">阅读(${click})</span>
          <span class="post-comments">评论(0)</span>
          <a href="javascript:;" class="post-like">
            <i class="fa fa-thumbs-up"></i>赞 (<span>${lovenum}</span>)
          </a>
          
        </p>
      </article>`
    }).join('')
    $('.rewen').html(rewen)
    $("#count").text(`共${count}条数据, ${Math.ceil(count / pageSize)}页`)
    $('.content .title').html(`<small class="pull-right">24小时更新：${num_day}篇 &nbsp; &nbsp; 一周更新：${num_week}篇</small><strong>最近更新</strong>`)
    renderPage(count)
  })
}

$(".excerpt").on("click", "#show", function(e) {
  localStorage.setItem("ider", $(this).attr("data-id") )
})
$(".content").on("click", "#show", function(){
  localStorage.setItem("ider", $(this).attr("data-id"))
})

// ==========================分页函数==============
// let laypage = layui.laypage
function renderPage(count) {
  layui.use('laypage', function () {
    let laypage = layui.laypage;

    //执行一个laypage实例
    laypage.render({
      elem: 'clicking', //注意，这里的 test1 是 ID，不用加 # 号 
      count,//数据总数，从服务端得到
      limit: 10,
      curr: query.pagenum,
      layout: ['prev', 'page', 'next'],
      theme: "#ff4500",
      jump: function (obj, first) {
        //obj包含了当前分页的所有参数，比如：
        // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
        // console.log(obj.limit); //得到每页显示的条数

        // 将页码值修改为点击时的当前页
        query.pagenum = obj.curr
        // 将每页显示数据修改为点击时的选择
        query.pagesize = obj.limit
        //首次不执行
        // console.log(123)
        if (!first) {
          // 点击分页的时候发ajax请求
          getNew()
        }
      }
    })
  });
}

